// import { isFunction } from '@hai2007/tool/type';
import drawMultiPolygon from "./map/drawMultiPolygon";
import getCenter from "./map/getCenter";

/*
 * 开发: 张磊
 * 校对：张磊
 */

// 地图
var getMapFun = function ($map, attr) {
  return $map({
    scale: attr.scale,
    center: attr.center,
    type: "eoap",
  });
};

var initConfig = function (attr, that) {
  var center = getCenter(attr["geo-json"]);

  if (attr.center.length < 2) attr.center = [center[0], center[1]];

  if (attr.cx == -1) attr.cx = that._width * 0.5;
  if (attr.cy == -1) attr.cy = that._height * 0.5;
  if (attr.width == -1) attr.width = that._width;
  if (attr.height == -1) attr.height = that._height;

  if (attr.scale == -1) {
    var xScale = (0.5 * attr.width) / center[2];
    var yScale = (0.5 * attr.height) / center[3];

    // 选择缩放最小的
    attr.scale = xScale < yScale ? xScale : yScale;
  }

  return center[4];
};

//  地图

export default [
  "number",
  "json",
  "string",
  "$map",
  "color",
  function ($number, $json, $string, $map, $color) {
    return {
      attrs: {
        "fill-color": $color("pink"),
        "stroke-color": $color("black"),
        "font-color": $color("rgb(255,255,255)"),
        type: $string("full"),
        cx: $number(-1)(true),
        cy: $number(-1)(true),
        width: $number(-1)(true),
        height: $number(-1)(true),

        // 地图缩放比例
        scale: $number(-1)(true),

        // 地图中心
        center: $json([])(function (newValue, oldValue, deep) {
          // 由于clay.js本身无法理解复杂类型，你如果希望有动画，需要自己定义动画的规则
          return [
            (newValue[0] - oldValue[0]) * deep + oldValue[0],
            (newValue[1] - oldValue[1]) * deep + oldValue[1],
          ];
        }),

        // 区域地图数据
        "geo-json": $json(),
      },
      region: {
        default: function (render, attr) {
          var map = getMapFun($map, attr);

          if (attr["geo-json"].type == "FeatureCollection") {
            for (var i = 0; i < attr["geo-json"].features.length; i++) {
              // 绘制
              drawMultiPolygon(
                map,
                render(i + "").config({
                  lineWidth: 1,
                  lineDash: [],
                }),
                attr["geo-json"].features[i].geometry,
                attr.cx,
                attr.cy,
                attr.type
              );
            }
          } else if (attr["geo-json"].type == "Feature") {
            // 绘制
            drawMultiPolygon(
              map,
              render().config({
                lineWidth: 1,
                lineDash: [],
              }),
              attr["geo-json"].geometry,
              attr.cx,
              attr.cy,
              attr.type
            );
          }
        },
      },
      link: function (painter, attr) {
        //     var centers = initConfig(attr, this);

        //     var map = getMapFun($map, attr);

        //     // 绘制前，设置画笔
        //     painter.config({
        //       fillStyle: attr["fill-color"],
        //       strokeStyle: attr["stroke-color"],
        //       lineWidth: 1,
        //       lineDash: [],
        //     });

        //     var type = attr.type;

        //     if (attr["geo-json"].type == "FeatureCollection") {
        //       for (var i = 0; i < attr["geo-json"].features.length; i++) {
        //         // 如果颜色是函数
        //         // if (isFunction(attr['fill-color'])) painter.config('fillStyle', attr['fill-color'].call(this, attr['geo-json'].features[i].properties, i));
        //         // if (isFunction(attr['stroke-color'])) painter.config('strokeStyle', attr['stroke-color'].call(this, attr['geo-json'].features[i].properties, i));

        //         if (true) {
        //           // 绘制
        //           drawMultiPolygon(
        //             map,
        //             painter,
        //             attr["geo-json"].features[i].geometry,
        //             attr.cx,
        //             attr.cy,
        //             type
        //           );
        //         } else {
        //           throw new Error(
        //             "Type error!" + JSON.stringify({ series: "map", type: type })
        //           );
        //         }
        //       }
        //     } else if (attr["geo-json"].type == "Feature") {
        //       // 如果颜色是函数
        //       // if (isFunction(attr['fill-color'])) painter.config('fillStyle', attr['fill-color'].call(this, attr['geo-json'].properties, 0));
        //       // if (isFunction(attr['stroke-color'])) painter.config('strokeStyle', attr['stroke-color'].call(this, attr['geo-json'].properties, 0));

        //       if (true) {
        //         // 绘制
        //         drawMultiPolygon(
        //           map,
        //           painter,
        //           attr["geo-json"].geometry,
        //           attr.cx,
        //           attr.cy,
        //           type
        //         );
        //       } else {
        //         throw new Error(
        //           "Type error!" + JSON.stringify({ series: "map", type: type })
        //         );
        //       }
        //     } else {
        //       throw new Error(
        //         "geo-json.type error!" +
        //           JSON.stringify({ series: "map", type: attr["geo-json"].type })
        //       );
        //     }

        //     painter.config({
        //       textAlign: "center",
        //       textBaseline: "middle",
        //       "font-size": 10,
        //       fillStyle: attr["font-color"],
        //     });

        //     // 绘制文字
        //     if (attr["geo-json"].type == "FeatureCollection") {
        //       for (var i = 0; i < attr["geo-json"].features.length; i++) {
        //         if ("cp" in attr["geo-json"].features[i].properties) {
        //           var textPosition = map(
        //             attr["geo-json"].features[i].properties.cp[0],
        //             attr["geo-json"].features[i].properties.cp[1]
        //           );
        //         } else {
        //           var textPosition = map(centers[i][0], centers[i][1]);
        //         }
        //         painter.fillText(
        //           attr["geo-json"].features[i].properties.name,
        //           attr.cx + textPosition[0],
        //           attr.cy + textPosition[1]
        //         );
        //       }
        //     } else if (attr["geo-json"].type == "Feature") {
        //       painter.fillText(attr["geo-json"].properties.name, attr.cx, attr.cy);
        //     }
        // console.log(attr['geo-json'])
        let map = $map({ scale: 6 });
        for (let pro of attr["geo-json"].features) {
          if (pro.geometry.type == "Polygon") {
            for (let cr of pro.geometry.coordinates) {
              painter
                .beginPath()
                .config({ fillStyle: "pink", strokeStyle: "blue" });
              for (let city of cr) {
                let point = map(...city);
                painter.lineTo(
                  point[0] + attr.cx + 400,
                  point[1] + attr.cy + 300
                );
              }
              painter.full();
            }
          } else {
            for (let cx of pro.geometry.coordinates) {
              painter
                .beginPath()
                .config({ fillStyle: "pink", strokeStyle: "blue" });
              for (let pl of cx[0]) {
                let point = map(...pl);
                painter.lineTo(
                  point[0] + attr.cx + 400,
                  point[1] + attr.cy + 300
                );
              }
              painter.full();
            }
          }
        }
      },
    };
  },
];
